Trik Blogspot

Buku Pintar Blogspot
MENGEDIT TEMPLATE
Navigasi dengan Penomoran

Blogger hadir dengan navigasi yang cukup minimalis. Pengunjung hanya
disediakan tiga buah link utama untuk navigasi, yaitu: Newer Posts, Home,
dan Older Posts. Newer Posts digunakan untuk navigasi ke posting yang lebih
baru, Home untuk membuka halaman awal blog, sedangkan Older Posts
digunakan untuk navigasi ke posting yang lebih lama.
Bagaimana jika jumlah posting dalam blog Anda cukup banyak? Mungkin saja
navigasi yang disediakan Google terasa kurang membantu. Untuk mengatasi
hal ini, Anda dapat menggunakan navigasi dengan penomoran. Jika
diterapkan, pengunjung dapat melompat ke posting-posting di bagian tengah
dengan nomor tertentu.
Praktek: Menerapkan navigasi dengan penomoran
1. Masuk ke dalam kustomisasi blog lalu pilih tab Tata Letak > Edit
HTML.
2. Aktifkan Expand Template Widget sehingga tercentang .
1
3. Cari bagian ]]></b:skin> lalu masukkan kode di atasnya. Anda dapat

menyalin kode dari CD buku pada file \Kode\navigasi-penomoran 1.txt.
Kode yang harus dimasukkan:

.showpageArea a {
text-decoration:underline;
}
.showpageNum a {
text-decoration:none;
border: 1px solid #cccccc;
margin:0 3px;
padding:3px;
}
.showpageNum a:hover {
background-color:#cccccc;
}
.showpagePoint {
color:#333;
background: #cccccc;
margin:0 3px;
padding:3px;
}
2
.showpageOf {
padding:3px;
margin: 0 3px 0 0;
}
.showpage a {
padding:3px;
}
.showpage a:hover {
}
.showpageNum a:link,.showpage a:link {
color:#333333;
}
4. Cari bagian lalu </body> masukkan kode berikut di atasnya. Anda dapat
menyalin kode dari CD buku pada file \Kode\ navigasi-penomoran 2.txt.


<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType !=
"static_page"'>
<script type='text/javascript'>
var pageCount=5;
var displayPageNum=5;
var upPageWord ='Previous';
var downPageWord ='Next';
</script>
<script
src='http://blogergadgets.googlecode.com/files/blogger-
page-navi.v1.js' type='text/javascript'/>
</b:if>
3
</b:if>

5. Aturlah jumlah posting di setiap navigasi. Caranya, masuk ke dalam tab
Pengaturan > Format. Ubah nilai pada bagian Tampilkan sebanyak
mungkin. Pada contoh ini, Penulis ingin menampilkan lima buah posting
di setiap halaman navigasi.
6. Periksa hasilnya dan pastikan sudah sesuai dengan yang kita inginkan.
Memasang Back to Top

Jika tulisan dalam posting Anda cukup panjang, maka mungkin sekali Anda
membutuhkan link Back To Top. Jika link ini diklik, maka pengunjung akan
kembali ke halaman web di bagian paling atas. Dengan demikian, link Back
To Top dapat membuat navigasi dalam blog Anda menjadi semakin nyaman.
Praktek: Memasang link Back to Top
1. Masuk ke dalam kustomisasi blog lalu klik pada tab Tata Letak >
Elemen Laman.
2. Masukkan kode berikut ke dalam gadget Teks atau gadget
HTML/Javascript. Anda dapat menyalin kode tersebut dari CD buku
pada file \Kode\back-to-top.txt.
<a
style="display:scroll;position:fixed;bottom:5px;right
:5px;" href="#" title="Back to Top"><img
4
src="http://img195.imageshack.us/img195/4669/backtoto
p.gif" /></a>
3. Perhatikan hasilnya pada halaman blog. Maka akan muncul tombol di
bagian kanan bawah. Jika tombol tersebut diklik, maka scroll bar akan
bergeser ke atas dan Anda kembali ke bagian atas halaman web.
Anda juga dapat menempatkan kode tersebut pada template. Untuk itu, klik
pada tab Tata Letak > Edit HTML. Letakkan tepat di bawah <body>.
Tutorial ini diambil dari “Buku Pintar Blogspot” yang ditulis oleh Rachmad
Hakim S. dan Roswati Andriyani. Keterangan selengkapnya dapat dilihat pada
website www.binsis.com.
BUKU PINTAR BLOGSPOT

BAB 1 SEKILAS BLOG
1.1 Pengenalan Blogspot.......................................................1
1.2 Pendaftaran Blogspot.......................................................4
1.3 Membuat Posting Blog....................................................9
BAB 2 MENGATUR TAMPILAN BLOGSPOT
2.1 Favicon..........................................................................11
2.2 NavBar...........................................................................15
5
2.2.1 Mengenal NavBar..................................................15

2.2.2 Modifikasi Tampilan NavBar................................20
2.2.3 Menghilangkan NavBar.........................................21
2.3 Mengatur Elemen Blogger.............................................23
2.3.1 Tata Letak Elemen Laman.....................................24
2.3.2 Menambahkan Gadget...........................................25
2.3.3 Menemukan Gadget Yang Sesuai..........................28
2.3.4 Menghapus Gadget dari Blog................................31
BAB 3 TEMPLATE BLOGGER
3.1 Website dan Template...................................................31
3.2 Mengatur Template (Templat)......................................35
3.2.1 Template Standar Blogspot...................................35
3.2.2 Template Blogger dengan Draft............................37
3.2.3 Template Generator...............................................43
3.2.4 Download Template..............................................46
3.2.5 Mengatur Warna dan Huruf...................................53
BAB 4 KONFIGURASI BLOGSPOT
4.1 Mengatur Profil..............................................................55
4.2 Pengaturan Blog............................................................61
4.2.1 Pengaturan Dasar Blog..........................................61
4.2.2 Pengaturan Format.................................................66
4.2.3 Pengaturan Komentar............................................68
4.2.4 Pengaturan Arsipkan..............................................72
4.2.5 Pengaturan Feed Situs...........................................73
4.2.6 Pengaturan Penulis dan Pembaca Blog.................77
BAB 5 ISI BLOG: POSTING
5.1 Manajemen Posting.......................................................81
5.1.1 Membuat Posting (Entri Baru)..............................82
5.1.2 Menggunakan Editor.............................................82
5.1.3 Posting dengan Email dan SMS............................91
5.1.4 Mengatur Format Posting......................................93
5.1.5 Membuat Halaman Web........................................94
6
5.2 Aneka Konten dalam Posting........................................96

5.2.1 Posting Berisi Gambar...........................................96
5.2.2 Posting Berisi Video............................................101
5.2.3 Posting Berisi Audio............................................107
5.2.4 Posting Berisi Flash.............................................110
5.3 Trik HTML Dalam Posting.........................................115
5.3.1 Memasukkan Tabel..............................................115
5.3.2 Marquee...............................................................116
5.3.3 Membuat Drop Cap.............................................120
BAB 6 GADGET BLOGSPOT
6.1 Gadget Penting Blogger...............................................122
6.1.1 Mengatur Drop Down pada Gadget Arsip...........124
6.1.2 Menggunakan Label Clouds (Tag Clouds)..........126
6.1.3 Menampilkan Avatar pada Komentar..................127
6.2 Statistik Blog...............................................................128
6.2.1 Web Counter........................................................129
6.2.2 Melacak No IP Pengunjung.................................134
6.2.3 Informasi Trafik dengan Lokasi..........................136
6.3 Internet Messaging dan Facebook...............................138
6.3.1 Yahoo Messenger................................................138
6.3.2 Google Talk.........................................................141
6.3.3 Facebok Profil Badge..........................................142
6.4 Gadget Interaksi User..................................................145
6.4.1 ShoutBox.............................................................145
6.4.2 Komunitas............................................................149
6.4.3 Tanya Jawab........................................................149
6.4.4 Form Kontak........................................................153
6.5 RSS Feed.....................................................................159
6.5.1 FeedBurner..........................................................159
6.5.2 Memasang Feed dari Website Lain.....................164
6.6 Hak Cipta.....................................................................166
6.6.1 Disable klik kanan blog.......................................166
6.6.2 Disable Seleksi.....................................................167
6.6.3 Copyscape............................................................168
7
6.6.4 Creative Commons..............................................169

6.6.5 Tynt......................................................................170
6.7 Gadget Unggulan Lainnya...........................................173
6.7.1 Menambahkan Sistem Rating..............................173
6.7.2 Snap Shots...........................................................176
6.7.3 Pilihan Bahasa.....................................................179
6.7.4 Relasi Posting Bergambar....................................181
6.7.5 PageRank.............................................................183
6.7.6 Kalender dan Jam pada Blog...............................185
6.7.7 Toolbar Blog........................................................188
6.7.8 Donasi PayPal......................................................192
6.7.9 Memasang Mesin Pencari Google.......................195
6.7.10 Memasang Blogroll Bergerak..............................196
BAB 7 MENGEDIT TEMPLATE

7.1 Mengubah Template....................................................198
7.1.1 Navigasi dengan Penomoran...............................198
7.1.2 Memasang Back to Top.......................................201
7.1.3 Menghilangkan Quick Edit..................................202
7.1.4 Navigasi Breadcrumb..........................................203
7.1.5 Menggunakan Emoticons pada Editor.................205
7.1.6 Menambah Gadget Di Atas Posting....................209
7.1.7 Menambahkan Iklan Melayang...........................210
7.2 Social Bookmark.........................................................211
7.2.1 Retweet................................................................212
7.2.2 Digg It..................................................................214
7.2.3 Google Buzz........................................................216
7.2.4 Facebook Share....................................................216
7.2.5 Social Bookmark: Add This................................217
7.2.6 Membuat Tombol Social Bookmark Sendiri.......219
7.3 Menambahkan Kode di Setiap Posting........................221
7.3.1 Menambahkan Print Printer.................................221
7.3.2 Membuat Print PDF.............................................222
8
7.3.3 Konten Setiap Kali Membuat Posting.................225

BAB 8 SETELAH BLOGSPOT
8.1 Dasar-Dasar Promosi Blog..........................................226
8.2 Search Engine dan Blog..............................................227
8.2.1 Membuat Sitemap................................................227
8.2.2 Submit Blog ke Google.......................................229
8.2.3 Submit Blog ke Yahoo........................................231
8.3 Pelengkap Search Engine............................................233
8.3.1 Direktori Blog......................................................233
8.3.2 Pinging.................................................................237
8.3.3 Mencari dan Menghilangkan Broken Link..........239
8.3.4 Bertukar Link (Exchange Link, Barter Tautan). .240
8.3.5 Membuat Newsletter............................................246
8.3 Nama Domain..............................................................254
8.3.1 Nama Domain Gratis...........................................254
8.3.2 Menggunakan Nama Domain..............................259
8.3.3 Menggunakan Nama Sub Domain.......................265
8.4 Backup dan Ekspor/Impor...........................................267
8.4.1 Ekspor Blogger....................................................267
8.4.2 Impor Blogger......................................................269
8.4.3 Aplikasi Blogger Backup.....................................271

Trik Blogspot

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Trik Blogspot

Uploaded by

Copyright:

Available Formats

Buku Pintar Blogspot

Navigasi dengan Penomoran

2. Aktifkan Expand Template Widget sehingga tercentang .

3. Cari bagian ]]></b:skin> lalu masukkan kode di atasnya. Anda dapat

Kode yang harus dimasukkan:

Memasang Back to Top

BUKU PINTAR BLOGSPOT

2.2.1 Mengenal NavBar..................................................15

5.2 Aneka Konten dalam Posting........................................96

6.6.4 Creative Commons..............................................169

BAB 7 MENGEDIT TEMPLATE

7.3.3 Konten Setiap Kali Membuat Posting.................225

You might also like